﻿.ui-date-time-scroller {
    position: relative;
    display: -ms-inline-grid;
    -ms-grid-rows: 1fr;
    -ms-grid-columns: 1fr 10px auto;

    .ui-date-time-input {
        -ms-grid-column: 1;
        -ms-grid-row: 1;
        -ms-grid-row-align: stretch;
    }
    
    .ui-date-time-reset {
        -ms-grid-column: 3;
        -ms-grid-row: 1;
        color: black;
        background-color: transparent;
        margin: 0;
        padding: 0;
        border: none;
        margin-top: 5px;
        box-sizing: border-box;
        text-align: center;
        min-width: 0;
        width: 40px;

        span.icon {
            font-size: 20pt;
            margin: 0;
            line-height: 40px;
        }

        span.icon.icon-remove::before {
            content: "\e10a";
            font-family: 'Segoe UI Symbol';
            color: #999;
        }
    }

    .ui-date-time-reset:active {
        span.icon.icon-remove::before {
            color: white;
        }
    }
}